::max<template>
    <div>
        <div class="i-layout-page-header">
          <div class="i-layout-page-header">
            <span class="ivu-page-header-title">{{$route.meta.title}}</span>
          </div>
        </div>
        <Card :bordered="false" dis-hover class="ivu-mt">
            <Form>
                <Row type="flex" :gutter="24">
                    <Col >
                        <FormItem label="2人拼团返利：" clearable>
                          <InputNumber :min="0" :max="300"  v-model="pink2.rebate" />%(0-300)
                        </FormItem>
                        <FormItem label="2人拼团拼中概率：" clearable>
                          <InputNumber :min="0" :max="100"  v-model="pink2.winning" />%(0-100)
                        </FormItem>
                        <FormItem label="2人拼团开奖时间：" clearable>
                          <InputNumber :min="0"  v-model="pink2.time" />分钟
                        </FormItem>
                    </Col>
                </Row>
                <Row type="flex" :gutter="24">
                    <Col >
                        <FormItem label="5人拼团返利：" clearable>
                          <InputNumber :min="0" :max="300"  v-model="pink5.rebate" />%(0-300)
                        </FormItem>
                        <FormItem label="5人拼团拼中概率：" clearable>
                          <InputNumber :min="0" :max="100"  v-model="pink5.winning" />%(0-100)
                        </FormItem>
                        <FormItem label="5人拼团开奖时间：" clearable>
                          <InputNumber :min="0"  v-model="pink5.time" />分钟
                        </FormItem>
                    </Col>
                </Row>
                <Row type="flex" :gutter="24">
                    <Col >
                        <FormItem label="10人拼团返利：" clearable>
                          <InputNumber :min="0" :max="300"  v-model="pink10.rebate" />%(0-300)
                        </FormItem>
                        <FormItem label="10人拼团拼中概率：" clearable>
                          <InputNumber :min="0" :max="100"  v-model="pink10.winning" />%(0-100)
                        </FormItem>
                        <FormItem label="10人拼团开奖时间：" clearable>
                          <InputNumber :min="0"  v-model="pink10.time" />分钟
                        </FormItem>
                    </Col>
                </Row>
                <Row type="flex" :gutter="24">
                    <Col >
                        <FormItem label="拼团开始时间：" clearable>
                          <Time-picker type="time" placeholder="选择时间" v-model="pt_start" @on-change="startChange" style="width: 168px"></Time-picker>
                        </FormItem>
                        <FormItem label="拼团结束时间：" clearable>
                          <Time-picker type="time" placeholder="选择时间" v-model="pt_end" style="width: 168px"></Time-picker>
                        </FormItem>
                    </Col>
                </Row>
                <Button type="primary" class="bnt mr15" @click="saveConfig">保存（修改保存后生效）</Button>
            </Form>
        </Card>
     </div>
</template>

<script>
import { combinationGetSetting, combinationSetSetting } from '@/api/marketing'
    export default {
        name: 'setting',
        data () {
            return {
              pink2: {
                rebate: 0,
                winning: 0,
                time: 0
              },
              pink5: {
                rebate: 0,
                winning: 0,
                time: 0
              },
              pink10: {
                rebate: 0,
                winning: 0,
                time: 0
              },
              pt_start: "",
              pt_end: ""
            }
        },
        created () {
          this.getConfig()
        },
        methods: {
          startChange(val){
            console.log(val);
          },
          getConfig(){
            combinationGetSetting().then(async res => {
              console.log(res);
              let config = res.config
              this.pink2.winning = config.pink2_winning
              this.pink2.rebate = config.pink2_rebate
              this.pink2.time = config.pink2_time
              this.pink5.winning = config.pink5_winning
              this.pink5.rebate = config.pink5_rebate
              this.pink5.time = config.pink5_time
              this.pink10.winning = config.pink10_winning
              this.pink10.rebate = config.pink10_rebate
              this.pink10.time = config.pink10_time
              this.pt_start = config.pt_start
              this.pt_end = config.pt_end
            })
          },
          saveConfig(){
            let params = {
              'pink2_winning': this.pink2.winning,
              'pink2_rebate': this.pink2.rebate,
              'pink2_time': this.pink2.time,
              'pink5_winning': this.pink5.winning,
              'pink5_rebate': this.pink5.rebate,
              'pink5_time': this.pink5.time,
              'pink10_winning': this.pink10.winning,
              'pink10_rebate': this.pink10.rebate,
              'pink10_time': this.pink10.time,
              'pt_start': this.pt_start,
              'pt_end': this.pt_end
            }
            console.log(params);
            combinationSetSetting(params).then(async res => {
              console.log(res);
              this.$Message.success(res.msg)
            })
          }
        }
    }
</script>

<style scoped lang="stylus">
    .tabBox_img
        width 36px
        height 36px
        border-radius:4px
        cursor pointer
        img
            width 100%
            height 100%
</style>
